// 该文件专门用于创建整个应用的路由器
import VueRouter from "vue-router";
// 引入组件，否则报错
import Home from "@/pages/Home.vue";
import About from "@/pages/About.vue";
import Message from "@/pages/Message.vue";
import News from "@/pages/News.vue";
import Detail from "@/pages/Detail.vue";

// 创建一个路由器。其中VueRouter是一个构造函数
const router = new VueRouter({
    routes: [
        {
            // 一级路由
            path: "/about", // 如果访问的/about路径，就访问的是About组件
            component: About,
        },
        {
            // 一级路由
            path: "/home", // 如果访问的是/home路径，就访问的是Home组件
            component: Home,
            // 二级路由
            children: [
                {
                    // 如果是二级路由的话，其中path里面的路径前面不需要加/，而vue框架会自动将/添加上去
                    path: "news",
                    component: News,
                },
                {
                    path: "message",
                    component: Message,
                    // 三级路由，一般最多不会超过六级路由
                    children: [
                        {
                            // 路由可以携带query参数
                            path: "detail",
                            component: Detail,
                        }
                    ]
                }
            ]
        },
    ]
})

// 暴露VueRouter
export default router;

